<template>
    <div class="login-div">
        <h3 class="font-center">登录</h3>
        <van-cell-group>
            <van-field v-model="username" label="账号" placeholder="请输入账号" />
            <van-field v-model="password" label="密码" placeholder="请输入密码" />
        </van-cell-group>
        <van-button :loading="isWating" type="info" loading-text="登录中" size="normal"
        class="font-center" block @click="login">登录</van-button>
    </div>
</template>

<script>
export default {
    name: 'Login',
    data() {
        return {
            username: "",
            password: "",
            // 是否加载
            isWating: false,
        }
    },
    methods: {
        async login(){
            this.isWating = true;
            let res = await this.$store.dispatch("getLogin", {
                username: this.username,
                password: this.password,
                identify: 1
            })
            this.isWating = false;
            if(res.success){
                this.$toast.success('登录成功');
                localStorage.setItem("token", res.data);
                setTimeout(() => {
                    this.$router.push("/index")
                }, 1000)
            }
            else{
                this.$toast.fail(res.message);
            }
        }
    },
}
</script>

<style scoped>
.login-div{
    width: 95%;
    margin: 0 auto;
}

.font-center{
    text-align: center;
}
</style>